<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<h1>用户的注册</h1>
		
		<form id="registerForm" name="myForm" action="注册成功.html" method="get">
			<label for="username">用户名</label>
			<input type="text" name="username" id="username" />
			<br />
			<label for="password">密码</label>
			<input type="password" name="password" id="password" />
			<br />
			<label for="email">邮箱</label>
			<input type="email" name="email" id="email" />
			<br />
			<label for="tel">电话号码</label>
			<input type="tel" name="tel" id="tel" />
			<br />
			爱好:
			<input type="checkbox" value="踢球" name="likes" />足球
			<input type="checkbox" value="篮球" name="likes" />篮球
			<input type="checkbox" value="看书" name="likes" />看书
			<input type="checkbox" value="旅游" name="likes" />旅游
			<br />
			
			<input type="submit" value="注册" />
			<input type="reset" value="重置" />
		</form>
		
		<script type="text/javascript">
			
			// 访问表单的方式1 forms[0]
			// document.forms[0].style.background = "red";
			// 访问表单的方式2 name属性
			// document.myForm.style.background = "blue";
			// 访问表单的方式3 id属性
			// registerForm.style.background = "green";
			
			// 访问表单中元素方式1
			document.forms[0].elements[0].style.background = "red";
			// 访问表单中元素方式2 name属性
			document.forms[0].password.style.background = "blue";
			// 访问表单中元素方式3 id属性
			email.style.background = "green";
			
			
			
			// 练习:
			// 综合练习2
			// 在注册页中添加爱好选项    
			// 
			// 添加一个按钮可以把所有爱好全部选中，全部取消
		</script>
	</body>
</html>
